<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>管理页面</title>
  <link rel="stylesheet" href="./css/default.css">
  <link rel="stylesheet" href="./fonts/iconfont.css">
  <link rel="stylesheet" href="./css/manage.css">

  <style>
    .name a {
      display: block;
      color: #fff;
      background-color: #3A8BFF;
      border-radius: 5px;
      text-align: center;
    }
  </style>
</head>

<body>
  <div class="top_nav">
    <div class="left">
      <div>
        <img src="./images/logo.png" alt="">
        <span>考试系统（学生端）</span>
      </div>
    </div>

    <div class="right">
      <div>
        <ul>
          <li></li>
          <li></li>
          <li></li>
          <li></li>
          <li class="name">
            <a href="./index.html">登录</a>
            <!-- <span>欢迎，</span> -->
          </li>
        </ul>
      </div>
    </div>
  </div>

  <div class="box_content">
    <div class="left_nav">
      <span class="welcome">
        <span> 湖南科技职业学院考试<br>系统欢迎您！</span>
      </span>

      <div class="manage_list">
        <ul>
          <li>
            <a href="./personal_1.html" target="right">
              <div class="link active">
                <i class="iconfont i_1"></i>
                查看考试
              </div>
            </a>
          </li>

          <li>
            <a href="./personal_2.html" target="right">
              <div class="link">
                <i class="iconfont i_3"></i>
                查看成绩
              </div>
            </a>
          </li>

          <li>
            <a class="exit">
              <div class="link">
                <i class="iconfont i_4"></i>
                退出
              </div>
            </a>
          </li>
        </ul>
      </div>
    </div>

    <iframe name="right"></iframe>

  </div>


  <script>
    // 页面加载完成后，默认显示试卷组卷页面
    document.addEventListener('DOMContentLoaded', () => document.querySelector('iframe').src = 'personal_1.html')

    // 点击管理列表中的链接，高亮当前链接
    const manage = document.querySelector('.manage_list')
    manage.addEventListener('click', function (e) {
      if (['DIV', 'A', 'I'].includes(e.target.tagName)) {
        const old = document.querySelector('.active')
        if (old) old.classList.remove('active') // 移除类
        const parentDiv = e.target.closest('div.link')
        parentDiv.classList.add('active') // 添加类
      }
    })
  </script>

  <script src="./js/personalCenter.js"></script>
</body>

</html>